<template>
    <div class="mainContent">
        <path-tracking :path='path' />
        <div class="pageContent">
            <div style="border-radius: 8px;overflow: hidden;">
                <basic-infos 
                    ref="basicInfo"
                    origin="shop"
                    pageType='create'
                    @checkGift="checkGift"
                    @phone_check="phone_check"
                />
                
                <custom-tag 
                    ref="customTag"
                    title='客户标签'
                    :hasScore="true"
                    :disabled="disabled"
                    pageType="create"
                />
    
                <div class="tableTitle">
                    <div class="tableIcon"></div>
                    <div class="tableText">备注：</div>
                </div>
                <div class="bgBox">
                    <div style="padding-bottom: 1rem;">
                        <el-input type='textarea' rows="5" style="width: 100%;resize: none;" v-model="remarks" :disabled="disabled">

                        </el-input>
                    </div>
                </div>

                <div class="tableTitle">
                    <div class="tableIcon"><img src="@/assets/img/flower_brown.png" /></div>
                    <div class="tableText"> 门店接待信息：</div>
                </div>
                <!--  -->
                <about-orders 
                    ref="aboutOrders"
                    :disabled="disabled"
                />
                <!-- 按钮 -->
                <div class="btnsCan">
                    <div class="btnLayout">
                        <div class="btn" @click="doSave(1)">保存</div>
                        <div class="btn cancel" @click="doCancel">取消</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import pathTracking from '@/components/common/pathTracking'
    import advancedSearch from '@/components/common/filter/advancedSearch.vue'
    import customTag from '../../component/customTag'
    import basicInfos from '../../component/basicInfos/forCreate.vue'
    import { createOrder, modifyOrder, findStaffByName } from '../axios.js'
    import verifyResult from '../../component/verifyResult'
    import aboutOrders from '../../component/aboutOrders'
    import { DRcookie } from '@/assets/js/common.js'
    export default {
        name: 'operateOrderShop',
        data() {
            return {
                path: ['CRM', '预约管理', {label: '预约接待', name: 'bookedToShop'}, '现场预约'],
                // 之前的数据
                previousData: '',
                // 备注
                remarks: '',
                followUpBy: '',
                followUpList: [],
                disabled: true
            }
        },
        components: {
            advancedSearch,
            pathTracking,
            verifyResult,
            basicInfos,
            customTag,
            aboutOrders
        },
        methods: {
            // 存
            doSave(status, failedReason) {
                // 详细信息
                let basicInfo = this.$refs.basicInfo.getResult();
                // 标签
                let tags = this.$refs.customTag.getResult();
                // 门店接待信息
                let treatInfo = this.$refs.aboutOrders.getResult();
                if(!basicInfo || !treatInfo || !tags) {
                    return
                }
                basicInfo.promotionSource = this.getDep();
                treatInfo.isDeal ? basicInfo.auditingStatus = 7 : basicInfo.auditingStatus = 6
                basicInfo = Object.assign(basicInfo, treatInfo)
                // 客户标签
                basicInfo.systemTagCategoryVO = tags;
                basicInfo.followUpRecords = [];
                // 是否到店状态
                basicInfo.isArrival = true
                // 备注
                let obj = {
                    content: this.remarks, 
                    type: 1
                }
                if(!/^[ ]*$/.test(this.remarks)) {
                    basicInfo.followUpRecords.push(obj)
                }

                // 客服创建的就是1，到店就是2
                basicInfo.type = 2;
                // 新增
                createOrder(basicInfo).then(res => {
                    if(res.data.status === 200) {
                        this.$message({
                            showClose: true,
                            message: '新增预约成功',
                            type: 'success'
                        });
                        this.sucCallback()
                    }else {
                        if(res.data.code == '1000001') {
                            this.$message({
                                showClose: true,
                                message: '手机号码格式不正确',
                                type: 'warning'
                            });
                        }
                    }
                }).catch(err => {
                    console.log('err: ', err)
                })
            },
            // 获取部门
            getDep() {
                let department = DRcookie.get('department')
                if(department) {
                    return `${department}`
                }else {
                    return ''
                }
            },
            getUserInfo() {
                let phone = this.$route.query.phone
                phone && this.$refs.basicInfo.fillPhone(phone)
            },
            sucCallback() {
                this.$refs.basicInfo.clearInput();
                this.$refs.customTag.clearInput();
                this.$router.replace({name: 'bookedToShop'})
            },
            // 点击取消，返回列表页
            doCancel() {
                this.$refs.basicInfo.clearInput();
                this.$refs.customTag.clearInput();
                this.$router.replace({name: 'bookedToShop'})
            },
            checkGift(phone) {
                this.$refs.aboutOrders.getGifts(phone)
            },
            phone_check(status) {
                this.disabled = status
            }
        },
        activated() {
            let shopCode = DRcookie.get('shopCode')
            if(shopCode == 'null') {
                this.$message({
                    message: '您不是门店用户，无法创建现场预约单！',
                    type: 'warning'
                })
                this.$router.go(-1)
                return
            }
            this.getUserInfo()
        },
        deactivated() {
            this.remarks = ''
        }
    }
</script>
<style scoped>
    .pageContent{
        padding: 16px;
        min-width: 58rem;
    }
    .tableTitle{
        height: 4rem;
        display: flex;
        align-items: center;
        flex-direction: row;
        justify-content: flex-start;
        background: #FFF;
    }
    .tableIcon{
        width: .4rem;
        margin-left: 1rem;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tableText{
        height: 100%;
        line-height: 4rem;
        margin-left: 0.4rem;
        font-size: 14px;
        font-weight: bold;
        color: #715D4A;
    }
    .btnsCan{
        background: #FFF;
        padding: 1.5rem 0;
    }
    .btnLayout{
        text-align: center;
    }
    .btn{
        display: inline-block;
        width: 120px;
        height: 40px;
        border-radius: 20px;
        background: #7e6b5a;
        text-align: center;
        line-height: 40px;
        color: #FFF;
        font-size: 14px;
        cursor: pointer;
        margin: 0 8px;
    }
    .cancel{
        background: #000;
    }
    .bgBox{
        background: #FFF;
        padding: 0 2.4rem;
    }
    .textArea{
        width: 100%;
        display: flex;
        font-size: 1.4rem;
        align-items: flex-start;
        justify-content: flex-start;
        color: #222222;
    }
</style>